import React, { Component } from 'react';
import {
	StyleSheet, Image, TouchableOpacity, Text
} from "react-native";
import { GLOBAL } from '../../config/global';
import { Right } from 'native-base';

const scale = GLOBAL.SCALE;

export class CommonHeaderRight extends Component {
	render() {
		let { onPress, tintColor, imgStyle, topTouchStyle, ifHiddenTitle, rightText, rightIcon, rightTextStyle } = this.props;
		return (
			<TouchableOpacity style={[styles.topTouch, { marginTop: ifHiddenTitle ? (GLOBAL.IS_IPHONEX ? 52 * scale : 10 * scale) : 0 }, topTouchStyle]} onPress={onPress} activeOpacity={0.5}>
				{rightText ? <Text style={[styles.rightTextStyle, rightTextStyle]}>{rightText}</Text> : null}
				{rightIcon ? <Image source={rightIcon} style={[styles.backIconStyle, { tintColor }, imgStyle]} /> : null}
			</TouchableOpacity>
		)
	}
}
const styles = StyleSheet.create({
	topTouch: {
		height: 40 * scale,
		flexDirection: 'row',
		alignItems: 'center',
		marginRight: 10 * scale
	},
	rightTextStyle: {
		color: '#fff',
		fontSize: 15 * scale,
		fontWeight: 'bold'
	},
	backIconStyle: {
		height: 13 * scale,
		width: 13 * scale,
		resizeMode: 'contain',
		marginLeft: 4 * scale
	}
})